
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:xin_he/utils/xin_he_user_data.dart';

import '../../../utils/xh_styles.dart';
import '../../../utils/xin_he_image.dart';
import '../../../utils/xin_he_input_widget.dart';
import 'xin_he_edit_prifile_logic.dart';

class XinHeEditPrifilePage extends StatelessWidget {
  XinHeEditPrifilePage({Key? key}) : super(key: key);

  final logic = Get.put(XinHeEditPrifileLogic());
  final state = Get.find<XinHeEditPrifileLogic>().state;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        if (Get.focusScope?.hasPrimaryFocus == true) {
          Get.focusScope?.unfocus();
        }
      },
      child: Scaffold(
        appBar: AppBar(
          centerTitle: true,
          leading: IconButton(
              onPressed: (){
                Get.back();
              },
              icon: Container(
                padding: const EdgeInsets.only(left: 7),
                alignment: Alignment.centerLeft,
                child: const XinHeAssetImage(
                  'assets/images/home/app_back_3.png',
                  width: 9.5,
                  height: 17,
                  fit: BoxFit.cover,),
              )
          ),
          title: const Text('编辑资料',style: TextStyle(color: Colors.black , fontSize: 18,fontWeight: FontWeight.w600),),
          backgroundColor: Colors.white,
          shadowColor: Colors.transparent,
        ) ,
        body:Obx(() =>  Column(
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [


            avatarView(),
            // _itemViews('昵称', '请输入您的昵称', (data) { logic.inputChange(data);}),
            // _itemViews('性别', '请输入您的性别', (data) { state.sex.value = data;}),
            // _itemViews('手机号', '请输入您的手机号', (data) { state.phone.value = data;}),

            _itemViews('昵称', '请输入您的昵称', (data) { state.name.value = data;},isShowLine: false,controller: logic.nameController),
            _itemViews('性别', '请输入您的性别', (data) { state.sex.value = data; },controller: logic.sexController),

            _itemViews('手机号', '请输入您的手机号', (data) { state.phone.value = data;},keyboardType: TextInputType.number,maxLength: 11,controller:logic.phoneController),
            // _regionItemView(),

            Spacer(),
            ///保存
            Container(
              margin:   EdgeInsets.only(left: 15,right: 15,bottom: Get.mediaQuery.padding.bottom+25),
              height: 44,
              width: double.infinity,
              decoration: BoxDecoration(color:XinHeColor('#30E9E9'),borderRadius: const BorderRadius.all(Radius.circular(22))),
              child: OutlinedButton(

                onPressed: (){
                  logic.saveEdittingProfile();
                },
                child:  const Text (
                  "保存",
                  style: TextStyle (fontSize: 16,color:  Colors.white, fontWeight: FontWeight.bold) ,
                  strutStyle: StrutStyle(
                    fontSize: 16,
                    leading: 0,
                    height: 1.1,
                    // 1.1更居中
                    forceStrutHeight: true, // 关键属性 强制改为文字高度
                  ),
                ),
              ),),
            SizedBox(height: Get.mediaQuery.padding.bottom+25,)

          ],
        )),
      ),
    );
  }

  // Widget _itemViews(String title,String hintText, Function(String) callback){
  //   return    Stack(children: [
  //     Container(
  //       height: 45,
  //       alignment: Alignment.centerLeft,
  //       color: Colors.white,
  //       padding: const EdgeInsets.symmetric(horizontal: 15),
  //       child: Row(children: [
  //         Text(title,style: TextStyle(color: XinHeColor('#333333'),fontSize: 13),),
  //         Spacer(),
  //         Container(
  //           width: 100,
  //           alignment: Alignment.centerRight,
  //           child: TextField(
  //             // maxLength: 8,
  //             maxLines: 1,
  //             keyboardType: TextInputType.number,
  //             textAlign: TextAlign.right,
  //             onChanged: (value){
  //               callback(value);
  //             },
  //             style:  TextStyle(
  //                 color: XinHeColor("#15161F"), fontSize: 14 ,fontWeight: FontWeight.w400),
  //             decoration:  InputDecoration(
  //                 border: InputBorder.none,
  //                 contentPadding: EdgeInsets.zero,
  //                 hintText: hintText,
  //                 counterStyle: TextStyle(
  //                     color: XinHeColor("#999999"), fontSize: 12),
  //                 hintStyle:  TextStyle(
  //                     color: XinHeColor("#999999"), fontSize: 12)),
  //           ),
  //         ),
  //         const SizedBox(width: 5+6,),
  //
  //       ],),),
  //     Container(width: Get.width,height: 0.5,color: XinHeStyle.lineColor,)
  //   ],);
  // }

  Widget _itemViews(String title,String hintText, Function(String) callback,{bool isShowLine = true,TextInputType keyboardType=TextInputType.text ,int maxLength = 1000 ,TextEditingController ?controller}){
    return    Stack(children: [
      Container(
        height: 45,
        alignment: Alignment.centerLeft,
        color: Colors.white,
        padding: const EdgeInsets.symmetric(horizontal: 15),
        child: Row(children: [
          Text(title,style: TextStyle(color: XinHeColor('#222222'),fontSize: 14,fontWeight: FontWeight.bold),),
          Spacer(),
          Container(
            width: 160,
            alignment: Alignment.centerRight,
            child: TextField(
              // maxLength: maxLength,
              controller: controller??TextEditingController(),
              maxLines: 1,
              keyboardType: keyboardType,
              textAlign: TextAlign.right,
              onChanged: (value){
                callback(value);
              },
              style:  TextStyle(
                  color: XinHeColor("#15161F"), fontSize: 14 ,fontWeight: FontWeight.w400),
              decoration:  InputDecoration(
                  border: InputBorder.none,
                  contentPadding: EdgeInsets.zero,
                  hintText: hintText,
                  counterStyle: TextStyle(
                      color: XinHeColor("#999999"), fontSize: 14),
                  hintStyle:  TextStyle(
                      color: XinHeColor("#999999"), fontSize: 14)),
              inputFormatters: [
                LengthLimitingTextInputFormatter(maxLength),

              ],
            ),
          ),
          // const SizedBox(width: 5+6,),

        ],),),
      isShowLine?  Container(width: Get.width,height: 0.5,color: XinHeStyle.lineColor,):Container()
    ],);
  }

  Widget avatarView(){
    return Container(
      height: 45,
      padding: const EdgeInsets.symmetric(horizontal: 15),
      color: Colors.white,
      alignment: Alignment.center,
      child: Row(children: [
        Text('头像',style: TextStyle(color: XinHeColor('#222222'),fontSize: 14,fontWeight:FontWeight.w500 ),),
        const Spacer(),
        GestureDetector(
          onTap: (){
            logic.selectedAvatarImage();
          },
          child: ClipRRect(
            borderRadius: BorderRadius.circular(11.5),
            child: xinHeUserData.appLoginState.value
                ?XinHeNetImage(url: state.avatar.value,width: 23,height: 23,fit: BoxFit.cover,)
                :const XinHeAssetImage('assets/images/mine/default_avatar.png',width: 23,height: 23,fit: BoxFit.cover,)
          ),
        ),
        const SizedBox(width: 3,),
        const XinHeAssetImage('assets/images/mine/mine_arrow.png',width: 6,height: 10,)

      ],),);
  }
}
